<template>
  <div class="input-div">
    <div class="row">
      <a-input-password placeholder="请输入旧密码" v-model="oldPassword" allow-clear></a-input-password>
    </div>
    <div class="row">
      <a-input-password placeholder="请输入新密码" v-model="newPassword" allow-clear></a-input-password>
    </div>
  </div>
</template>

<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { Input } from "ant-design-vue";

@Component({
  name: "ByOld",
  components: {
    AInput: Input,
    AInputPassword: Input.Password
  }
})
export default class ByOld extends Vue {
  private oldPassword = "";
  private newPassword = "";
  private saving = false;

  private get params() {
    return {
      oldPassword: this.oldPassword,
      newPassword: this.newPassword
    };
  }

  private beforeSave() {
    this.$message.destroy();
    if (this.oldPassword === "") {
      this.$message.error("请输入旧密码");
      return false;
    }

    if (this.newPassword === "") {
      this.$message.error("请输入新密码");
      return false;
    }

    return true;
  }

  private init() {
    this.oldPassword = "";
    this.newPassword = "";
  }

  private async save() {
    if (this.beforeSave()) {
      const res = await this.$api.UpdatePwdByOld(this.params);

      if (res && res.code === 200) {
        this.init();
        return Promise.resolve(true);
      }
    }
    return Promise.resolve(false);
  }
}
</script>

<style lang="less" scoped></style>
